@charset "utf-8";
$bg_color:#ff9344;
$text_color:#494949;

@function r($px){
	@return $px/50+rem;
}
body{
	font-size: r(32);
}
.web{
	header{
		padding: r(15) r(22);
		display: flex;
		justify-content: space-between;
		align-items: center;
		.logo-box{
			width: r(123);
			height: r(123);
			overflow: hidden;
			img{
				width: 100%;
			}
		}
		.search{
			width: r(268);
			height: r(55);
			// background-color: red;
			border: r(1) solid $bg_color;
			border-radius: r(55);
			overflow: hidden;
			form{
				box-sizing: border-box;
				display: flex;
				width: 100%;
				height: 100%;
				line-height: r(55);
				padding: 2% 0;
				overflow: hidden;
				input{
					font-size: r(24);
					justify-content: center;
					padding-left: r(20);
					padding-top: r(3);
					width: r(190);
					height: 96%;
					border: none;
					vertical-align: top;
					outline: none;
				}
				i{
					padding-left: r(6);
					vertical-align: r(5);
					color: $bg_color;
					font-size: r(40);
				}
			}
		}
		.city-box{
			width: r(164);
			height: r(58);
			overflow: hidden;
			box-sizing: border-box;
			// background-color: yellow;
			border: r(1) solid $bg_color;
			select{
				width: 100%;
				height: 100%;
				border: none;
				vertical-align: top;
				font-size: r(24);
			}
		}
	}
	.header{
		padding: r(50) r(22) r(15);
		display: flex;
		justify-content: space-between;
		align-items: center;
		.anniu{
			width: r(150);
			height: r(58);
			border: r(1) solid $bg_color;
			border-radius: r(58);
			overflow: hidden;
			button{
				color: #000;
				background-color: #fff;
				border: none;
				font-size: r(30);
				outline: none;
				padding: 7% 25%;
			}
		}
		.city-box{
			width: r(164);
			height: r(58);
			overflow: hidden;
			box-sizing: border-box;
			// background-color: yellow;
			border: r(1) solid $bg_color;
			select{
				width: 100%;
				height: 100%;
				border: none;
				vertical-align: top;
				font-size: r(30);
			}
		}
	}
	main{
		position: absolute;
		left: r(0);
		top: r(153);
		bottom: r(136);
		overflow-y: auto;
		width: 100%;
	}
	footer{
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: r(136);
		ul{
			display: flex;
			justify-content: space-around;
			align-items: center;
			li{
				a{
					display: block;
					text-align: center;
					width: 100%;
					height: 100%;
					i{
						color: $bg_color;
						font-size: r(74);
					}
					p{
						color: $text_color;
						font-size: r(27);
						font-weight: bold;
					}
				}
				&.active a{
					color: $bg_color;
				}
			}
		}
	}
}